<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8" isELIgnored="false"%>
<%@ include file="/WEB-INF/views/shared/taglib.jsp"%>
<%
	request.setAttribute("title", "加入创客");
%>

<%@ include file="/WEB-INF/views/shared/master/weContentHeader.jsp"%>

<style>
body{
	position: relative;
}
	.title {
		z-index: 0 !important;
	}
	
	.weui-cells {
		font-size: 0.7rem;
		margin-top: 0;
		position: static;
	}

	.weui-cell:before{
		border-top:0;
	}
	
	.weui-cells:before {
		border-top: 0;
	}
	.weui-cells:after{
		border-bottom: 0px
	}
	.weui-cell{
		padding:10px 0px 10px 0px;
		margin:0 auto;
		width:85%;
		border-bottom: 1px solid #f5f5f5;
	}
	
/* 	.weui-label {
		letter-spacing: 0.2rem;
		width: 110px;
		color: #333;
	} */
	.weui-input{
		text-align: right;
		color: #999;
	}
	.weui-btn_primary {
		width: 90%;
		background-color: #27a0ff;
	}
	
	.label {
		width: 10%;
		float: left;
	}
	
	.color-blue {
	 	color: #27a0ff;
	}
	.spacing {
		width:100%;
		height:16px;
		background-color: #ebebeb;
	}
	.weui-toptips {
		height: 1.8rem !important;
		font-size: 1.1rem;
	}
	.btn-code{
		float:right;
	}
	.input-code{
		width:50%;
	}
	.btn-text{
		background-color:white;
		color:#2196F3;
		padding:5px;
		border:1px solid #2196F3;	
	}
	.weui-cells_checkbox .weui-check:checked+.weui-icon-checked:before{
		color: #1fa0db;
	}
	.toolbar .picker-button{
		color: #2196F3;
	}
	.weui-cells_radio .weui-check:checked+.weui-icon-checked:before{
		color: #2196F3;
	}
	
	input[disabled]{color:#777777;opacity:1}
</style>

<%@ include file="/WEB-INF/views/shared/master/weTitle.jsp"%>
<div class="goback" data-back-point="personCenter"></div>
<input type="hidden" name="currentLevel" id="currentLevel" value="${customer.level}" />
<input type="hidden" name="reduce" id="reduce" value="0" />

<form name="joinEntrepreneur" id="joinEntrepreneur" action=""  method="post">
<input type="hidden" name="refereeId" id="refereeId" />
<input type="hidden" name="refereeIdentity" value="0" id="refereeIdentity" />
<input type="hidden" name="level" id="level" value="${customer.level}" />
<input type="hidden" name="id" id="id" value="${customer.id}" />
<input type="hidden" name="openId" id="openId" value="${customer.openId}" />
<input type="hidden" name="tradeNo" id="tradeNo"/>

<div class="showloading" style="background: rgba(0,0,0,0.6);position: absolute;top:0px;left:0px;text-align: center;z-index: 300" hidden>
	
</div>

<div style="text-align: center;">
	<img  style="margin-top: 2rem;width: 20%;margin-bottom: 1rem" src="<c:url value='/images/we/cust/icon_up.png' />">
</div>
<div class="weui-cells weui-cells_form">
	<c:set value="" var=" " />
	<c:if test="${customer.username ne ''&& customer.username !=null }">
		<c:set value="disabled='disabled'" var="usernameAttr" />
	</c:if>
	<div class="weui-cell">
		<div class="weui-cell__hd"><label class="weui-label">真实姓名</label></div>
		<div class="weui-cell__bd">
			<input id="username" ${usernameAttr} name="username" class="weui-input" type="text" placeholder="请输入姓名" value="${customer.username }">
		</div>
	</div>
	<c:set value="empty" var="phoneStatus" />
	<c:set value="" var="phoneAttr" />
	<c:if test="${customer.phone ne ''&&customer.phone !=null }">
		<c:set value="notEmpty" var="phoneStatus" />
		<c:set value="disabled='disabled'" var="phoneAttr" />
	</c:if>
	<div class="weui-cell">
		<div class="weui-cell__hd">
			<label class="weui-label">联系电话</label>
		</div>
		<div class="weui-cell__bd">
			<input id="phone" name="phone" ${phoneAttr} class="weui-input" type="tel" placeholder="请输入联系电话" value="${customer.phone }">
		</div>
	</div>
	<c:if test="${phoneStatus eq 'empty' }">
		<div class="weui-cell">
			<div class="weui-cell__hd">
				<label class="weui-label">验证码</label>
			</div>
			<div class="weui-cell__bd">
				<input id="code" name="code" class="weui-input yanZhengMa" placeholder="请输入验证码" value="">
				<div class="btn-code">
					<button type="button" class="btn-text" id="btn-get" onclick="getCode()">获取验证码</button>
				</div>
			</div>
		</div>
	</c:if>
	<c:if test="${customer.password eq ''|| customer.password==null}">
		<div class="weui-cell">
			<div class="weui-cell__hd">
				<label class="weui-label">支付密码</label>
			</div>
			<div class="weui-cell__bd">
				<input id="password" name="password" class="weui-input" type="password" placeholder="用于支付与提现" value="">
			</div>
		</div>
	</c:if>
	
	<c:if test="${customer.region eq ''|| customer.region==null || customer.level eq 'visitor'}">
		<div class="weui-cell">
			<div class="weui-cell__hd">
				<label class="weui-label">服务地区</label>
			</div>
			<div class="weui-cell__bd">
				<input id="city-picker" name="region" placeholder="请选择地区" value="${customer.region}" class="weui-input selected-color" type="text">
			</div>
		</div>
	</c:if>

	
	<c:if test="${customer.refereeId eq ''||customer.refereeId==null}">
		<div class="weui-cell">
			<div class="weui-cell__hd">
				<label class="weui-label">推荐人电话</label>
			</div>
			<div class="weui-cell__bd">
				<input id="refereePhone" name="refereePhone" class="weui-input" type="tel" placeholder="请输入推荐人电话" />
			</div>
			<div>
				<img style="width:75%;" src="<c:url value='/images/we/registration/help.png'/>" id="help"/>
			</div>
		</div>	
	</c:if>
	<div class="weui-cell">
		<div class="weui-cell__hd">
			<label class="weui-label">创客类型</label>
		</div>
		<div class="weui-cell__bd">
			<input class="weui-input" id="type" type="text" value="" onclick="showLoad()">
		</div>
	</div>	
	
	<div class="weui-cell" href="<c:url value='/wechat/cust/colAndFoot/collectIndex' />" style="border-bottom: 0px;">
		<div class="weui-cell__hd" onclick="yesToRead()">
			<img  class="icon_img img_no" style="width: 15px;height: 15px;display: none" src="<c:url value='/images/we/cust/icon_no.png' />">
			<img  class="icon_img img_yes" style="width: 15px;height: 15px;" src="<c:url value='/images/we/cust/icon_yes.png' />">
		</div>
		<div class="weui-cell__bd">
			<p style="color: #999;padding-left: 3px">已阅读并同意<a class="color-blue" href="<c:url value='/wechat/cust/customerIden/entrepreneurProtocol' />">《创客注册协议》</a></p>
		</div>
		<div class="weui-cell__ft">
		</div>
	</div>

</div>

<button type="button" onclick="joinMaker()" class="weui-btn weui-btn_primary" style="width: 90%;margin-top: 1rem">提交</button>
<div class="weui-cell" style="border-bottom:0px;">
		<div id="type-tip" style="color: #999; font-size: 14px !important;">
			
		</div>
</div>
</form>

<div style="display:none;" id="confirm">
<div class="weui-mask weui-mask--visible"></div>
<div class="weui-dialog weui-dialog--visible">
	<div class="weui-dialog__hd">
		<strong class="weui-dialog__title">推荐人电话</strong>
	</div>
	<div class="weui-dialog__hd">请填写邀请人的手机号码，您加入创客后可以获得10元红包的新人奖励。若没有推荐人，请点击无邀请人。</div>
	<div class="weui-dialog__ft">
		<a href="javascript:;" class="weui-dialog__btn default" id="noReferee">无邀请人</a>
		<a href="javascript:;" class="weui-dialog__btn default" id="haveReferee">有邀请人</a>
	</div>
</div>
</div>
<%@ include file="/WEB-INF/views/shared/scripts/jquery.jsp"%>
<%@ include file="/WEB-INF/views/shared/scripts/jqweui.jsp"%>	
<%@ include file="/WEB-INF/views/shared/scripts/city-picker.jsp"%>
<script>

	$(function(){
		
		if($("#phone").val()==null||$("#phone").val()==""){
			$(".yanZhengMa").addClass("input-code");
		}
		
		$(".showloading").width(window.screen.availWidth);
		$(".showloading").height(window.screen.availHeight);
		
		/*如果是高创，点击加入创客的链接，直接跳转到个人中心*/
		var level=$("#level").val();
		if(level=="highMaker"){
			window.location.href=$.getVirtualPath()+"/wechat/cust/personCenter/index";
			return;
		}
		
		loadCity();
		/* 加载产品类型 */
		loadGoodsType();
		
		/*点击选择邀请电话*/
		$("#help").click(function(event){
			event.stopPropagation();
			$("#confirm").show();
		});
		$("#haveReferee").click(function(){
			$("#confirm").hide();
		});
		$("#noReferee").click(function(){
			$("#refereePhone").val("4000858118");
			$("#confirm").hide();
		});
		
		/*点击弹出密码规则*/
		$("#helpPassword").click(function(event){
			event.stopPropagation();
			$.alert("此密码会用作本平台支付密码");
		});
	});
	
	/*得到当前登录人*/
	function getCustomerInfo(){
		var url=$.getVirtualPath()+"/wechat/cust/personCenter/getCustomerInfo";
		var customer=$.getJsonPost(url);
		return customer;
	}
	
	
	function loadCity(){
		$("#city-picker").cityPicker({
			title: "请选择服务地区"
		});
	}

	function loadGoodsType(){
		var url=$.getVirtualPath()+"/admin/wechat/wechatGoods/getGoodsBySearch?types=maker";
		var responseModel=$.getJsonPost(url);
		console.log(responseModel);
		if($.isNull(responseModel)){
			return;
		}
		if(responseModel.status!=200){
			$.alert(responseModel.message);
		}
		var level=$("#level").val();
		var goodsList=responseModel.arguments.wechatGoodsList;
		var goodsItems=[];
		var sel=0;
		var reduce=0;
		$.each(goodsList,function(index,goods){
			if(level=="maker"&&goods.goodsMark=="maker"){
				reduce+=goods.price;
				sel++;
				return true;
			}
			var name=goods.name+"("+(goods.price-reduce)+"元/年)";
			if(index==sel){
				$("#type").data("values",goods.id);
				$("#type").val(name);
				$("#level").val(goods.goodsMark);
				$("#type-tip").text(goods.title);
			}
			goodsItems.push({title:name,value:goods.id,desc:goods.title,goodsMark:goods.goodsMark});
		});
		
		$("#reduce").val(reduce);
		
		$("#type").select({
		  title: "选择类型",
		  items: goodsItems,
		  onChange:function(item){
			  var goods=item.origins[0];
			  $("#type-tip").text(goods.desc);
			  $("#level").val(goods.goodsMark);			  
		  },
		  onClose:function(){
			  $(".showloading").hide();
		  }
		});
	}
	
	function joinMaker(){
		//防止后退进来的
		var customer= getCustomerInfo();
		var level=$("#level").val();
		if(customer.level==level){
			var title=level=="highMaker"?"高创":"初创";
			$.toast("您已加入【"+title+"】无需重复加入", "forbidden");
			return;
		}
		if(!checkInput()){return;}
		
		var goodsId=$("#type").data("values");
		var url=$.getVirtualPath()+"/wechat/wechatPay/payInfo?openId="+$("#openId").val();
		var data=[{"goodsId":goodsId, "counts":1, "reduce":$("#reduce").val() }];
		$.ajax({
			url:url,
			type:'post',
			dataType:'json',
			contentType:'application/json',
			data:JSON.stringify(data),
			success:function(resInfo){
					$("#tradeNo").val(resInfo.payInfo.tradeNo);
					startPay(resInfo.payInfo,payCallback);					
			},
			error:function(res){
					$.toptip(res.responseText,"error");
			}
		});
	}
	
	function startPay(res,payCallback){
		if($.isNull(res)){
			$.alert("支付信息不能为空");
			return;
		}
		if($.isNull(payCallback)){
			$.alert("回调信息不能为空");
			return;
		}
		
		var config={
		           "appId":res.appId,     //公众号名称，由商户传入     
		           "timeStamp":""+res.timeStamp,         //时间戳，自1970年以来的秒数     
		           "nonceStr":res.nonceStr, //随机串     
		           "package":res.package,     
		           "signType":res.signType,         //微信签名方式：     
		           "paySign":res.paySign //微信签名 
		       };
		
		WeixinJSBridge.invoke('getBrandWCPayRequest', config,payCallback); 
	}

	function payCallback(res){
		if(res.err_msg == "get_brand_wcpay_request:ok") {
     	   	$.toast("支付成功");
     		
     	  	var formData=$("#joinEntrepreneur").serialize();
			var url=$.getVirtualPath()+"/wechat/cust/customerIden/updateLevel";
	 	   	var result=$.getTextPost(url,formData);
	 	   	
	 	   	if(result=="true"){
	 		   	setTimeout(function(){
	 			  /*  	window.location.href=$.getVirtualPath()+"/wechat/cust/personCenter/index";	 */
	 		   	window.location.href=$.getVirtualPath()+"/wechat/acti/choujiang?actiId=d25c15ef-f24c-4b0d-a931-572ff76b9a2c";
	 		   	},100);
	 	   	}
        }else if(res.err_msg == "get_brand_wcpay_request:cancel"){
     	   	$.toast("支付取消","cancel");
        }else if(res.err_msg == "get_brand_wcpay_request:fail"){
     	   	$.toast("支付失败", "forbidden");
        }  
	}
	
	function sendMessage(){
	    var phoneNum = $("#phone").val();
	    sendMessagePhone = phoneNum;
	    var url=$.getVirtualPath()+"/wechat/cust/customerIden/sendMessage";
	    $.getText(url,"phone="+phoneNum);
		setCountdown();
	}
	
	/*检测用户是否已经注册*/
	function checkPhoneExist(){
		var phoneNum = $("#phone").val();
		var url=$.getVirtualPath()+"/wechat/cust/customerIden/checkPhoneExisted";
		var result=$.getTextPost(url,"phone="+phoneNum);
		return eval(result);
	}
	
	/*检测推荐人号码存不存在*/
	function getCustomerByPhone(){
		var phoneNum = $("#refereePhone").val();
		var url=$.getVirtualPath()+"/wechat/cust/customerIden/getCustomerByPhone";
		return $.getJsonPost(url,"phone="+phoneNum);
	}
	
	function getCode(){
		if(checkPhone()){
			if(checkPhoneExist()){
				$.toptip('该手机号已经被注册','error');
				return;
			}
			sendMessage();
		}else{
			$('#phone').focus();
		}
	}
	
	function setCountdown() {
		var $btnSend = $("#btn-get");
	    if (countdown == 0) { 
	    	$btnSend.attr('disabled',false); 
	    	$btnSend.text("获取验证码");
	        countdown = 60; 
	        return;
	    }
	    $btnSend.attr('disabled',true);
	    $btnSend.text("(" + countdown + ")s后重发");
	    countdown--;
	    setTimeout(function() { setCountdown($btnSend) },1000)
	}
	
	//验证姓名
	function checkUsername(){
		var name = $("#username").val();
		if($.isNull(name)){
			$.toptip('真实姓名不能为空','error');
			return false;
		}
		return true;
	}
	
	//验证地区
	function checkRegion(){
		if($("#city-picker").length<=0){
			return true;
		}
		var region = $("#city-picker").val();
		if($.isNull(region)){
			$.toptip('请选择地区','error');
			return false;
		}
		return true;
	}
	
	/*验证注册的人的手机号码*/
	function checkPhone(){
		var phone = $('#phone').val();
		var pattern = /^1[0-9]{10}$/;
		if($.isNull(phone)) {
			$.toptip("请输入手机号码",'error');
			return false;
		}else if(!pattern.test(phone)){
			$.toptip('请输入正确的手机号码','error');
			return false;
		}
		return true;
	}
	
	/*检查推荐人的电话是否格式正确*/
	function checkRefereePhone(){
		var phone = $('#refereePhone').val();
		var pattern = /^1[0-9]{10}$/;
		if($.isNull(phone)) {
			$.toptip("请输入推荐人手机号码",'error');
			return false;
		}else if(!pattern.test(phone)){
			if(phone == "4000858118"){
				return true;
			}
			$.toptip('请输入正确的推荐人手机号码','error');
			return false;
		}else if(phone == $("#phone").val()){
			$.toptip('推荐人电话不能与联系电话相同', 'error');
			return false;
		}
		return true;
	}

	var countdown=60; 
	//验证码
	function checkCode(){
		if($("#code").length<=0){
			return true;
		}
		var code = $("#code").val();
		if($.isNull(code)){
			$.toptip("请输入验证码","error");
			return false;
		}

		var url = $.getVirtualPath()+"/wechat/cust/customerIden/checkCode";
		var result = $.getTextPost(url,"code="+code);
		if(result=="true"){
			return true;
		}else if(result=="expire"){
			$.toast("验证码过期", "forbidden");
			return false;
		}else if(result=="error"){
			$.toast("验证码错误","forbidden");
			return false;
		}else if(result=="false"){
			$.toast("验证码出错，请重新获取","forbidden");
			return false;
		}
	
		return true;
	}
	
	//验证密码
	function checkPassword(){
		if($("#password").length<=0){
			return true;
		}
		var password=$("#password").val();
		var reg2 = /^[0-9]{6}$/;
		
		if($.isNull(password)){
			$.toptip("密码不可为空","error");
			return false;
		}else if(!reg2.test(password)){
			$.toptip("密码必须为6个数字","error");
			return false;
		}
		return true;
	}
	
	function checkRefereeId(){
		if($("#refereePhone").length<=0){
			return true;
		}
		var phone = $("#refereePhone").val();
		if(!checkRefereePhone()){
			return false;
		}
		if(phone == "4000858118"){
			$("#refereeIdentity").val("1");
			return true;
		}
		var customer=getCustomerByPhone();
		if($.isNull(customer)){
			$.toptip("推荐人手机号不存在","error");
			return false;
		}
		$("#refereeIdentity").val(customer.userIdentity);
		$("#refereeId").val(customer.id);
		return true;
	}
	var temp = 0;
	function yesToRead() {
		if(temp==0){
			$(".img_yes").hide();
			$(".img_no").show();
			temp=1;
		}else{
			$(".img_yes").show();
			$(".img_no").hide();
			temp=0;
		}
	}
	
	//验证是否同意协议
	
	function checkProtocol(){
		if(temp==1){
			$.toptip("请选择是否同意协议",'error');
			return false;
		}
		return true;
	}
	
	//检查输入
	function checkInput(){		
			if(checkUsername()&&
			   checkPhone()&&
			   checkRegion()&&
			   checkProtocol()&&
			   checkCode()&&
			   checkPassword()&&
			   checkRefereeId()){
				return true;
			} 
		return false;
	}
	//遮罩层的显示隐藏
	function showLoad() {
		$(".showloading").show();
	}
</script>

<%@ include file="/WEB-INF/views/shared/master/weContentFooter.jsp"%>
